import Vue from 'vue'
import VueRouter from 'vue-router'

Vue.use(VueRouter)

const routes = [
    //如果访问根路径，重定向到登录界面
    { 
        path: '/', 
        redirect: '/home' 
    },
    //=======前台页面=======
    {
        path: '/home',
        name: 'Home',
        component: () => import('../views/front/Home.vue'),
        redirect: '/main',
        children: [
            {
                path: '/error',
                name: 'Error',
                component: () => import('../components/Error.vue')
            },
            {
                path: '/main',
                name: 'Main',
                component: () => import('../views/front/Main.vue')
            },
            {
                path: '/goods',
                name: 'Goods',
                component: () => import('../views/front/Goods.vue')
            },
            {
                path: '/about',
                name: 'About',
                component: () => import('../views/front/About.vue')
            },
            {
                path: '/goods/details',
                name: 'Details',
                component: () => import('../views/front/Details.vue')
            },
            {
                path: '/shoppingCart',
                name: 'ShoppingCart',
                component: () => import('../views/front/ShoppingCart.vue'),
                meta: {
                    requireAuth: true // 需要验证登录状态
                }
            },
            {
                path: '/collect',
                name: 'Collect',
                component: () => import('../views/front/Collect.vue'),
                meta: {
                    requireAuth: true // 需要验证登录状态
                }
            },
            {
                path: '/myOrder',
                name: 'MyOrder',
                component: () => import('../views/front/MyOrder.vue'),
                meta: {
                    requireAuth: true // 需要验证登录状态
                }
            },
            {
                path: '/confirmOrder',
                name: 'ConfirmOrder',
                component: () => import('../views/front/ConfirmOrder.vue'),
                meta: {
                    requireAuth: true // 需要验证登录状态
                }
            },
            // {
            //     path: '/payment',
            //     name: 'Payment',
            //     component: () => import('../views/front/Payment.vue'),
            //     meta: {
            //         requireAuth: true // 需要验证登录状态
            //     }
            // },
            {
                path: '/paymentSuccess',
                name: 'PaymentSuccess',
                component: () => import('../views/front/PaymentSuccess.vue'),
                meta: {
                    requireAuth: true // 需要验证登录状态
                }
            }
        ]
    },
    //=======后台页面=======
    { 
        path: '/login', 
        name: 'Login',
        component: () => import('../components/Login.vue')
    },
    {
        path: '/admin', 
        name: 'Admin',
        component: () => import('../components/Home.vue'), 
        redirect: '/welcome',
        children: [
            { 
                path: '/welcome', 
                name: 'Welcome',
                component: () => import('../components/Welcome.vue') 
            },
            { 
                path: '/user', 
                name: 'User',
                component: () => import('../components/user/User.vue') 
            },
            { 
                path: '/productType',
                name: 'ProductType',
                component: () => import('../components/product/ProductType.vue') 
            },
            { 
                path: '/product',
                name: 'Product',
                component: () => import('../components/product/Product.vue') 
            },
            { 
                path: '/product/add',
                name: 'AddProduct',
                component: () => import('../components/product/Add.vue') 
            },
            { 
                path: '/product/update',
                name: 'UpdateProduct',
                component: () => import('../components/product/Update.vue') 
            },
            { 
                path: '/order',
                name: 'Order',
                component: () => import('../components/order/Order.vue') 
            },
            {
                path: '/statistics',
                name: 'Statistics',
                component: () => import('../components/Statistics.vue')
            }
        ]
    }
];

const router = new VueRouter({
    //路由规则对象
    routes
})

// 挂载路由导航守卫
// router.beforeEach((to, from, next) => {
//     //to 将要访问的路径
//     //from 代表从哪个路径跳转而来
//     //next 是一个函数，表示放行
//     //next()放行 next('/path')强制跳转指定的路径

//     if(to.path === '/login') return next();
//     //获取token
//     const tokenStr = window.sessionStorage.getItem('token');
//     if(!tokenStr) return next('/login');
//     //放行
//     next();
// })
/* 由于Vue-router在3.1之后把$router.push()方法改为了Promise。所以假如没有回调函数，错误信息就会交给全局的路由错误处理。
vue-router先报了一个Uncaught(in promise)的错误(因为push没加回调) ，然后再点击路由的时候才会触发NavigationDuplicated的错误(路由出现的错误，全局错误处理打印了出来)。*/
// 禁止全局路由错误处理打印
const originalPush = VueRouter.prototype.push;
VueRouter.prototype.push = function push (location, onResolve, onReject) {
  if (onResolve || onReject)
    return originalPush.call(this, location, onResolve, onReject)
  return originalPush.call(this, location).catch(err => err)
}

export default router;